<template>
    <div style="width: 1400px; margin-left: 10px">
        <h2 style="text-align: left; margin-left: 15px; font-size: 20px;">{{ title }}</h2>
        <el-row :gutter="24">
            <el-col :span="8" v-for="(item, index) in personalized">
                <el-image :src="item.picUrl" />
                  <h1>{{item.name}}</h1>
            </el-col>
        </el-row>
        
    </div>
</template>

<script lang="ts">
import { computed, defineComponent, ref } from 'vue'
import {useStore} from 'vuex';
export default defineComponent({
    name: 'DuJia',
    setup() {
        const title = ref("独家专享>");
        const store = useStore();
        store.dispatch("contaniner/personalized")
      return{
        title,
        personalized: computed(()=>store.state.contaniner.personalized)
      }
        
    },
})
</script>


<style lang="less" scoped>

    div{
        .el-row{
            .el-col{
                .el-image{
                    border-radius: 15px;
                    height: 180px;
                    width: 400px;
                }
            }
        }
    }

</style>